<lib-form-section
  title="Data Volumes"
  text="
    Configure the Volumes to be mounted as your Datasets.
  "
  icon="fa:fas:hdd"
>
  <div [formGroup]="parentForm">
    <button
      mat-stroked-button
      class="add-data-vol-button"
      color="accent"
      (click)="addVol()"
      type="button"
      [disabled]="readonly"
    >
      <mat-icon>add</mat-icon>ADD VOLUME
    </button>

    <div *ngFor="let vol of datavols; let i = index" class="volume-wrapper">
      <app-volume
        [volume]="vol"
        [notebookName]="parentForm.get('name').value"
        [namespace]="parentForm.get('namespace').value"
        [pvcs]="pvcs"
        [ephemeral]="false"
        [defaultStorageClass]="defaultStorageClass"
      >
      </app-volume>

      <div class="del-btn">
        <button
          mat-icon-button
          color="warn"
          (click)="deleteVol(i)"
          type="button"
          [disabled]="readonly"
        >
          <mat-icon>delete</mat-icon>
        </button>
      </div>
    </div>
  </div>
</lib-form-section>
